<template>
  <el-table-column v-if="hasSlots">
    <template #default="{ row, $index }">
      <!-- <slot name="default" v-bind="scope"></slot> -->
      <slot name="default" :row="row" :$index="$index"></slot>
    </template>
  </el-table-column>
  <el-table-column v-else>
    <template #default="scope">
      {{ renderFunc(scope.row) }}
    </template>
  </el-table-column>
</template>
<script setup>
  import { computed } from '@vue/reactivity'
  import { isString } from '@/utils/validate.js'
  import { useSlots, useAttrs } from 'vue'

  // 判断是否用到了插槽
  const slots = useSlots()
  const hasSlots = !!useSlots().default

  const attrs = useAttrs()

  // console.log('props.prop =' + props.prop)

  // const tableLabel = computed(() => {
  //   console.log('props.prop =' + attrs.prop)
  //   return attrs.prop
  // })
  const renderFunc = computed(function () {
    return (row) => {
      if (row) {
        const lable = row[attrs.prop || attrs.property]
        return lable
      } else {
        return ''
      }
    }
  })
</script>
<script>
  export default {
    name: 'XMTableColumn',
  }
</script>
